<template>
    <el-row class="main-cont padd20">
        <el-row>
            <el-col class="title box box-pack-between">
                <el-select v-model="selectVal" placeholder="请选择" @change="handleSelect" class="text">
                    <el-option :label="`${item.xn+'-'+item.xq}`" :value="item.xn+'-'+item.xq" v-for="(item,index) in xqList" :key="index"></el-option>
                </el-select>
                <div class="btn">
                    <el-button class="reset-comfirm-btn mr10" @click="$router.push('/zsgl')">证书模板</el-button>
                    <el-button class="reset-comfirm-btn" @click="openPopup">颁发</el-button>
                </div>
            </el-col>
        </el-row>

        <el-row class="mt20">
            <el-col>
                <el-table :data="bfList" stripe style="width: 100%" :header-cell-style="{background:'#F0F1F8', color:'#2F3142'}" border>
                    <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
                    <el-table-column prop="name" label="证书名称"  align="center"></el-table-column>
                    <el-table-column prop="unit" label="统计单元" width="150" align="center"></el-table-column>
                    <el-table-column prop="zyfw" label="专业范围" width="150" align="center"></el-table-column>
                    <el-table-column prop="xjfw" label="学级范围" width="150" align="center"></el-table-column>
                    <!-- <el-table-column prop="rules" label="规则组合" align="center"></el-table-column> -->
                    <el-table-column prop="status" label="状态" width="150" align="center">
                        <template slot-scope="scope">
                            <span v-if="scope.row.status == '1'" style="color: #18AC72;">已颁发</span>
                            <span v-else style="color:#ccc;">未颁发</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" align="center" width="250">
                        <template slot-scope="scope">
                            <span v-if="scope.row.status == '0'" class="bf-btn" @click="handlePubcert(scope.row)">发布</span>
                            <span class="cp" @click="detail(scope.row)">详情</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>

        <add-admin :dialogVisible="tkzt" @closeTk="closeTk" @updateList="getXqList()" :title="title"></add-admin>
    </el-row>
</template>

<script>
    import addAdmin from './components/tjgly.vue';

    export default {
        components: {
            addAdmin
        },
        data() {
            return {
                page: {
                    total: 0,
                    pageSize: 10,
                    pageNum: 1,
                    list: []
                },
                tkzt: false,
                selectVal: '',
                searchText: '',
                title:'添加',
                schoolid: this.$store.state.schoolId,
                xqList:[],
                bfList:[]
            };
        },
        created() {
            this.getXqList();
        },
        methods: {
            tableRowClassName({
                row,
                rowIndex
            }) {
                if (rowIndex === 1) {
                    return 'warning-row';
                } else if (rowIndex === 3) {
                    return 'success-row';
                }
                return '';
            },
            closeTk() {
                this.tkzt = false;
            },
            openPopup() {
                this.$router.push({
                    path:"/zs/zsbf/tjzs"
                })
            },
            getXqList() {
                let params = {
                    schoolid: this.schoolid
                };
                this.$api.Admin.getXqList(params).then(res => {
                    if (res.code == '0') {
                        this.xqList = res.list;
                        res.list.map(res=>{
                            if(res.isCur == 1){
                                this.selectVal = res.xn+'-'+res.xq
                                this.getBfList()
                            }
                        })
                    } else {
                        this.$message.error('请求失败！');
                    }
                })
            },
            getBfList() {
                let params = {
                    schoolid: this.schoolid,
                    xn:this.selectVal.split('-')[0],
                    xq:this.selectVal.split('-')[1].substr(0,3)
                };
                this.$api.Admin.getBfList(params).then(res => {
                    if (res.code == '0') {
                        this.bfList = res.list;
                    } else {
                        this.$message.error('请求失败！');
                    }
                })
            },
            changeStatus(userid, status) {
                let params = {
                    'userId': userid,
                    'status': status
                };
                this.$api.szhgl.qyjy(params).then(res => {
                    if (res.code == '0') {
                        this.$message.success('操作成功！');
                        this.glylb();
                    } else {
                        this.$message.error('请求失败！');
                    }
                })
            },
            detail(item){
                this.$router.push({
                    name:'zsxq',
                    params:{
                        certpubid:item.id
                    }
                })
            },
            handleSelect() {
                this.getBfList()
            },
            handlePubcert(item) {
                let params = {
                    id: item.id
                };
                this.$api.Admin.pubcert(params).then(res => {
                    if (res.code == '0') {
                        this.getBfList()
                        this.$message.success('操作成功！');
                    } else {
                        this.$message.error('请求失败！');
                    }
                })
            },
            clickAdd() {

            }
        }
    }
</script>

<style scoped lang="scss">
    .bf-btn {
        padding: 3px 5px;
        width: 64px;
        height: 24px;
        background: linear-gradient(-7deg, #FF9B4F, #FFBC3A);
        border-radius: 12px;
        color: #fff;
        cursor: pointer;
    }
    .el-table .warning-row {
        background: oldlace;
    }

    .el-table .success-row {
        background: #f0f9eb;
    }
</style>
